import React from 'react'
import { NavBar, Toast } from 'antd-mobile';
import { useNavigate } from 'react-router-dom';

export default function Wxin() {
    const navigate = useNavigate()


const back = () => Toast.show({
      content: '取消了登录',
      duration: 1000,
  },navigate('/login'));


const back1 = () => Toast.show({
    content: '您拒绝了登录',
    duration: 1000,
},navigate('/login'));
  return (
    <div>
        <NavBar onBack={back}>XXX</NavBar>
        <div className='box'>
            <h2>关闭</h2>
            <h2 style={{display:'flex',alignItems:'center'}}><img width={'55px'} height={'55px'} style={{borderRadius:'15px',marginRight:'20px'}} src='./img1.png'/>XXX 申请使用</h2>
            <h1>你的微信头像、昵称、地区和性别信息</h1>

            <div style={{marginTop:'30px'}}>
                <p>你可以选择使用不同的个人信息登录</p>
                <div style={{borderTop:'1px solid #CCC',borderBottom:'1px solid #CCC',display:'flex',alignItems:'center',padding:'10px 0'}}>
                    <img style={{width:'50px',borderRadius:'10px',marginRight:'20px'}} src='./ime1.png'/>
                    <h3>特别容易饿</h3>
                </div>
                <div style={{borderTop:'1px solid #CCC',borderBottom:'1px solid #CCC',display:'flex',alignItems:'center'}}>
                    <span style={{ fontSize:'40px', color:'#CCC', margin:'0 37px 0 10px'}}>+</span>
                    <h3>新建用户名</h3>
                </div>
            </div>
            <div >
                <p style={{textAlign:'center',marginTop:"25px"}}><span className='button_login_ty' onClick={()=>{ navigate('/my') }}>同意</span></p>
                <p style={{textAlign:'center',marginTop:"20px"}}><span className='button_login_ju' onClick={()=>{ back1() }}>拒绝</span></p>
            </div>
        </div>
    </div>
  )
}
